<template>
  <div class="container">
    <!-- 数据备份 -->
    <el-tabs class="tabs-borderCard" v-model="activeName">
      <el-tab-pane label="备份列表" name="one">
        <!-- 查询条件 -->
        <el-form :inline="true" class="tableSearchBox" size="medium">
          <el-form-item>
            <el-button type="primary" icon="el-icon-plus" >手动备份</el-button>
          </el-form-item>
        </el-form>
        <!-- /查询条件 -->
        <PagesTable :tableHeader="tableHeader" :tableData="tableData" :tableOperation="tableOperation"
          :tablePagination="tablePagination" />
      </el-tab-pane>
      <el-tab-pane label="定时备份" name="two">
        <!-- 备份设置 -->
        <div class="sanfan-detailBox">
          <div class="mb20"></div>
          <div class="bd" style="border:0">
            <table class="detailTable mb20" >
              <tr>
                <td class="fc-yellow">数据备份建议选择业务低峰期时刻进行</td>
              </tr>
              <tr>
                <td><label class="label">保留天数：</label>10</td>
              </tr>
              <tr>
                <td><label class="label">备份时间：</label>01:00 - 02:00</td>
              </tr>
              <tr>
                <td><label class="label">备份周期：</label>星期四</td>
              </tr>
            </table>
            <div>
              <el-button type="primary" plain size="small">编辑</el-button>
            </div>
          </div>
        </div>
      </el-tab-pane>

    </el-tabs>
  </div>
</template>

<script>
  import PagesTable from "../../components/PagesTable.vue";
  export default {
    components: {
      PagesTable
    },
    data() {
      return {
        activeName: "one",
        tableHeader: [{
            name: "序号",
            mark: "index",
            minWidth: "90"
          },
          {
            name: "文件名",
            mark: "name",
            minWidth: "90"
          }, {
            name: "备份时间",
            mark: "time",
            minWidth: "90"
          },
          {
            name: "备份类型",
            mark: "type",
            minWidth: "90"
          },
          {
            name: "操作",
            mark: "",
            minWidth: "90"
          },
        ],
        tableOperation: [{
            name: "还原",
            mark: "refresh-right",
            icon: true
          },
          {
            name: "删除",
            mark: "delete",
            icon: true
          },
        ],
        tablePagination: {
          show: true,
          current: 1,
          size: 10,
          total: 1
        },
        tableData: [],
        //tab2
        //other
      }
    },
    mounted() {
      this.getData()
      this.tableData=[
        {index:1,name:"2024-07-18日备份数据.zip",type:"zip",time:"2024-07-18 15:33"}
      ]
    },
    beforeDestroy() {},
    created() {},
    methods: {
      getData() {},
      pageSizeChange(data) {
        const self = this
        self.tablePagination.size = data
        self.getData()
      },
      currentPageChange(data) {
        const self = this
        self.tablePagination.current = data
        self.getData()
      },
    }
  }
</script>
<style lang="scss" scoped>

</style>